<script lang="ts" setup>
    import { onMounted } from 'vue';
    import { useRoute } from 'vue-router';
    import { getAppVersion } from '@utils/NativeUtils';
    import { mainStore } from '@/store/main';

    const Route = useRoute();
    const store = mainStore();

    // TODO://暂时注释
    // onMounted(() => {
    //     getAppVersion()
    //         .then((version) => {
    //             window.sessionStorage.setItem('version', version.toString());
    //         })
    //         .catch(() => {
    //             window.sessionStorage.setItem('version', '0.1.0');
    //         });
    // });

    const themeVars = {
        buttonWarningBackground: '#FFCC00',
        buttonWarningBorderColor: '#FFCC33',
        skeletonAvatarBackground: '#AAAAAA',
        skeletonRowBackground: '#AAAAAA',
    };
</script>

<template>
    <van-config-provider :theme-vars="themeVars">
        <van-skeleton
            :loading="store.GET_SKELETON_LOADING || false"
            :row="6"
            avatar
            style="margin-top: 2rem"
            title>
            <router-view v-slot="{ Component }">
                <keep-alive :exclude="store.keepAliveExcludeComponents">
                    <component :is="Component" />
                </keep-alive>
            </router-view>
        </van-skeleton>
    </van-config-provider>
</template>

<style lang="scss">
    $bodyBgColor: #f3f7fa;
    $fontColor: #262626;
    $fontSize: 15px;

    * {
        margin: 0;
        padding: 0;
    }

    img {
        -moz-user-select: none;
        -ms-user-select: none;
        -webkit-user-select: none;
        user-select: none;
        vertical-align: sub;
        pointer-events: none;
        -webkit-touch-callout: none;
    }

    body {
        background: $bodyBgColor;
    }

    #app {
        font-size: pxToRem($fontSize);
        font-family: -apple-system, BlinkMacSystemFont, 'Microsoft YaHei', sans-serif;
        color: $fontColor;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        /*text-align: center;*/
    }
    .hideVconsole {
        #__vconsole {
            display: none;
        }
    }
</style>
